<template>
  <div class="dashboard-container">
    <el-card style="margin-bottom: 20px">
      <!-- 给el-form绑定form -->
      <el-form label-width="120px" :model="form" :inline="true">

        <el-form-item label="注册日期">
          <el-date-picker
            v-model="form.addtime"
            type="date"
            style="width: 203px"
            placeholder="注册日期开始"
            size="default"
          />
        </el-form-item>
        <el-form-item label="注册日期">
          <el-date-picker
            v-model="form.endtime"
            type="date"
            style="width: 203px"
            placeholder="注册日期结束"
            size="default"
          />
        </el-form-item>

        <div>
          <el-button
            type="primary"
            icon="el-icon-search"
            @click="searchclick"
            style="margin-left: 12px"
            >筛选</el-button>
          <el-button @click="resetSearch">重置</el-button>

<!--          <el-button @click="daochu" type="success">导出用户</el-button>-->

<!--          <el-button type="primary" @click="userloglists()" size="small"-->
<!--          >导出日志</el-button>-->
        </div>

        <!-- <el-button @click="addrenyuan" type="success">添加</el-button> -->
      </el-form>
    </el-card>
    <el-table :data="tableData" border>
      <el-table-column prop="id" label="ID" align="center"> </el-table-column>
      <el-table-column prop="nickname" label="昵称" align="center">
      </el-table-column>
      <el-table-column prop="login_num" label="登陆次数" align="center">
      </el-table-column>
      <el-table-column prop="create_time" label="注册时间" align="center">
        <template slot-scope="scope">
          {{ scope.row.create_time | datefilter }}
        </template>
      </el-table-column>
      <el-table-column width="100" prop="laiyuan" label="进入方式" align="center">
        <template slot-scope="{ row }">
          <el-tag :type="row.typ == 1 ? 'primary' : 'success'">{{
              row.laiyuan | vipfilter
            }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="login_ip" label="登录ip" align="center">
      </el-table-column>
<!--      <el-table-column label="操作" align="center">-->
<!--        <template slot-scope="scope">-->
<!--          <el-button type="success" @click="tiaozhuanguige(scope.row)"-->
<!--          >收益变动</el-button>-->
<!--          <el-button type="primary" @click="updateuser(scope.row)" size="small"-->
<!--          >修改提现比例</el-button>-->
<!--        </template>-->
<!--      </el-table-column>-->

    </el-table>
    <Pagination2
      :currentPage="this.form.pageNo"
      :size="this.form.pageSize"
      :total="total"
      @changelimit="changelimit"
      @changecurrentPage="changecurrentPage"
    ></Pagination2>
    <add ref="add" @refresh="refresh"></add>
    <update ref="update" @refresh="refresh"></update>
  </div>
</template>

<script>
import { getuseryyblist, updateuserupdate } from "@/api/dingdan";
import add from "./modules/add";
import update from "./modules/update";
// import istuijian from "@/views/secondservices/modules/istuijian.vue";
import { pushwenjian } from "@/api/push";
export default {
  name: "Dashboard",
  components: {
    add,
    update,
  },
  data() {
    return {
      form: {
        addtime: "",
        endtime: "",
        pageNo: 1,
        pageSize: 15,
      },
      total: 0,
      tableData: [],
    };
  },
  filters: {
    vipfilter(val) {
      if (val == 1) {
        return "第一页进入";
      } else if (val == 2) {
        return "第二页进入";
      } else if (val == 3) {
        return "第三页进入";
      }
    },
    datefilter2(val) {
      if (val) {
        var date = new Date(parseInt(val) * 1000);
        var Year = date.getFullYear();
        var Moth =
          date.getMonth() + 1 < 10
            ? "0" + (date.getMonth() + 1)
            : date.getMonth() + 1;
        var Day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
        var Hour =
          date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
        var Minute =
          date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
        var Sechond =
          date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
        var GMT =
          Year +
          "-" +
          Moth +
          "-" +
          Day +
          "   " +
          Hour +
          ":" +
          Minute +
          ":" +
          Sechond;

        return GMT;
      } else {
        return "";
      }
    },
    datefilter(val) {
      if (val) {
        var date = new Date(parseInt(val) * 1000);
        var Year = date.getFullYear();
        var Moth =
          date.getMonth() + 1 < 10
            ? "0" + (date.getMonth() + 1)
            : date.getMonth() + 1;
        var Day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
        var Hour =
          date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
        var Minute =
          date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
        var Sechond =
          date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
        var GMT =
          Year +
          "-" +
          Moth +
          "-" +
          Day +
          "   " +
          Hour +
          ":" +
          Minute +
          ":" +
          Sechond;

        return GMT;
      } else {
        return "";
      }
    },
  },
  methods: {
    async change(e, id) {
      console.log(e, id);
      let data = {
        id: Number(id),
        status: e ? 1 : 2,
        adminid:Number(localStorage.getItem('userId'))
      };
      console.log(data);
      let result = await updateuserupdate(data);
      if (result.code == 0) {
        this.$message({
          showClose: true,
          message: "修改状态成功",
          type: "success",
        });
      }
      this.getuserlist1();
    },
    searchclick() {
      this.getuserlist1();
    },
    async daochu() {
      let param = {
        addtime:
          this.form.addtime == ""
            ? ""
            : Math.floor(new Date(this.form.addtime).getTime() / 1000),
        endtime:
          this.form.endtime == ""
            ? ""
            : Math.floor(new Date(this.form.endtime).getTime() / 1000),
      };
      // this.$router.push({ path: "https://api.suishilian.com/admin/exceldc", query: param });
      const externalLinkWithParams = `https://api.suishilian.com/admin/exceluser?create_time=${param.create_time}&login_num=${param.login_num}&phone=${param.phone}&vip=${param.vip}&status=${param.status}&modelphone=${param.modelphone}`;

      window.location.href = externalLinkWithParams;
    },
    resetSearch() {
      this.form.addtime = "";
      this.form.endtime = "";
      this.getuserlist1();
    },
    addrenyuan(val) {
      this.$refs.add.add(val);
    },
    updateuser(val) {
      this.$refs.update.edit(val);
    },
    tiaozhuanguige(val) {
      this.$router.push({
        name: "shouyi",
        query: {
          uid: val.id,
        },
      });
    },
    userloglist(val) {
      this.$router.push({
        name: "userlog",
        query: {
          uid: val.id,
        },
      });
    },
    userloglists() {
      this.$router.push({
        name: "userlogs",
      });
    },
    // 子传父:自定义事件
    refresh() {
      this.getuserlist1();
    },
    async getuserlist1() {
      let param = {
        addtime:
          this.form.addtime == ""
            ? ""
            : Math.floor(new Date(this.form.addtime).getTime() / 1000),
        endtime:
          this.form.endtime == ""
            ? ""
            : Math.floor(new Date(this.form.endtime).getTime() / 1000),
      };
      let result = await getuseryyblist({
        ...param,
        pageNo: this.form.pageNo,
        pageSize: this.form.pageSize,
        adminid:Number(localStorage.getItem('userId'))
      });
      // console.log(result);
      if (result.code == 0) {
        this.tableData = result.data.data;
        this.total = result.data.totalCount;
        if (result.data.data != null) {
          result.data.data.forEach((item) => {
            if (item.status == 1) {
              this.$set(item, "switch", true);
            } else {
              this.$set(item, "switch", false);
            }
          });
        }
      }
    },
    changelimit(val) {
      this.form.pageSize = val;
      this.getuserlist1();
    },
    changecurrentPage(val) {
      this.form.pageNo = val;
      this.getuserlist1();
    },
    changerenyuan(val) {
      this.$refs.add.edit(val);
    },
  },
  watch: {
    "form.phone": {
      handler(newVal) {
        if (newVal == "") {
          this.getuserlist1();
        }
      },
    },
  },
  mounted() {
    this.getuserlist1();
  },
};
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }
  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}
</style>
